import { useCallback, useEffect, useState } from 'react';
import {View,Text,TouchableOpacity,StyleSheet,Alert, ScrollView,Image} from 'react-native';
import { useSelector } from 'react-redux';
import '../../global';
import { MaterialCommunityIcons } from '@expo/vector-icons';
import { AntDesign } from '@expo/vector-icons';
import { useFocusEffect } from '@react-navigation/native';
const showAlert = (msg,fun) =>
  Alert.alert(
    "提示",
    msg,
    [
      {
        text: "确认",
        onPress: fun,
        style: "cancel",
      },
    ],
    {
      cancelable: false, 
    }
  );
const Like = ({navigation}) => {
    const list=useSelector(state=>state.list)
    const [commendList,setCommendList] = useState([{}]);
        useFocusEffect(
            useCallback(()=>{
                fetch('https://wx.qasdwer.top:8080/user/getlike',{
                method:'post',
                headers:{
                  'content-type':'application/json;charset=utf-8'
                },
                body:JSON.stringify({account:list.account})
                })
                .then(res=>res.json())
                .then(res=>{
                    setCommendList(res) 
                })
            },[])
        )
        return(
            <ScrollView>
                {
                commendList.map((item,index)=>{
                        return (
                            <View key={index}>
                                <TouchableOpacity  onPress={()=>navigation.navigate('ShareDetail',{listcon:item})} style={{marginBottom:changeH(30)}}>
                                <View style={styles.listview}>
                                    <View style={styles.usermes}>
                                        <Image source={{uri:item.userimg}} style={styles.userimg} />
                                        <Text numberOfLines={1} style={styles.namet}>{item.username}</Text>
                                        <Text numberOfLines={1} style={styles.namet}>{item.time0}</Text>
                                    </View>
                                    <Text numberOfLines={2} style={styles.listcontent}>{item.content}</Text>
                                    {
                                        item.img!=undefined?
                                        <Image source={{uri:item.img[0]}} style={styles.listimg}/>
                                        :
                                        <View></View>

                                    }
                                    
                                </View>
                            </TouchableOpacity>
                            <View style={styles.com}>
                                    <AntDesign name="heart" size={24} color="red" />
                                        <Text>{item.likenum}</Text>
                                        <MaterialCommunityIcons name="comment-processing-outline" size={24} color="rgba(0,0,0,0.7)" />
                                        <Text>{item.comnum}</Text>
                                    </View>
                        </View>
                        )
                })
            }
            </ScrollView>
        )
    
    
}
const styles=StyleSheet.create({
    listview:{
        width:'95%',
        backgroundColor:'white',
        marginTop:changeH(20),
        marginLeft:changeW(20),
        marginRight:changeW(20),
        borderRadius:changeW(30),
        paddingBottom:changeH(50)
    },
    listcontent:{
        color:'rgba(0,0,0,0.7)',
        top:changeH(30),
        left:changeW(30),
        width:'95%',
        marginRight:changeW(20)
    },
    listimg:{
        width:changeW(190),
        height:changeH(170),
        marginTop:changeH(50),
        marginLeft:changeW(30),
        borderRadius:changeW(10)
    },
    userimg:{
        width:changeW(70),
        height:changeW(70),
        borderRadius:changeW(35),
    },
    usermes:{
        width:changeW(350),
        height:changeH(70),
        marginTop:changeH(30),
        marginLeft:changeW(30),
        flexDirection:'row',
    },
    namet:{
        lineHeight:changeH(75),
        marginLeft:changeW(25)
    },
    com:{
        width:'20%',
        marginLeft:changeW(520),
        marginTop:changeH(20),
        marginBottom:changeH(10),
        flexDirection:'row',
        position:'absolute',
        bottom:changeH(35),
        justifyContent:'space-around'
    }
})
export default Like